<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>中华香舍</title>
    <meta name="copyRight" content="版权为前端小牛雷小酥所有，禁止复制">
    <meta name="keywords" content="中华香舍,中华香舍贸易有限公司,香薰蜡烛,香薰," />
    <meta name="description" content="中华香舍贸易有限公司的香薰产品介绍" />
    <link rel="shortcut icon" href="img/icon.ico" type="image/x-icon">
    <script src="./static/vue.js"></script>
    <link rel="stylesheet" href="./src/css/swiper.css">
    <link rel="stylesheet" href="./src/css/general.css">
    <link rel="stylesheet" href="./src/css/index.css">
    <link rel="stylesheet" href="./src/css/footer.css">
</head>

<body>
    <header class="ch-head g-f-xy-between-center">
        <div class="logo"><img src="./img/logo.png" alt="无法显示" title="中华香舍"></div>
        <ul class="ch-items g-f-xy-around-center g-text-12em-b">
            <li class="ch-item g-ell-zero g-tr2 g-f-y-center ch-item1"><a href="javaScript:;">公司简介</a></li>
            <li class="ch-item g-ell-zero g-tr2 g-f-y-center ch-item2"><a href="javaScript:;">产品介绍</a></li>
            <li class="ch-item g-ell-zero g-tr2 g-f-y-center ch-item3"><a href="javaScript:;">商品区</a></li>
            <li class="ch-item g-ell-zero g-tr2 g-f-y-center ch-item4"><a href="javaScript:;">使用说明</a></li>
            <li class="ch-item g-ell-zero g-tr2 g-f-y-center ch-item5"><a href="javaScript:;">关于我们</a></li>
        </ul>
        <div class="login g-f-xy-around-center">
            <div class="badge">4</div>
            <div class="userPic g-img-50"><img src="./img/userPic.webp" alt=""></div>
            <div class="loginBtn g-cur-poi g-ell-zero g-tr2">点击登录</div>
        </div>
    </header>
    <section class="mv">
        <video src="./img/produce1.mp4" autoplay muted loop></video>
        <!-- 遮罩层分栏模块 -->
        <div class="mask g-ab-tl g-s-100 g-flex">
            <div class="maskList minMask"></div>
            <div class="maskList maxMask"></div>
            <div class="maskList maxMask"></div>
            <div class="maskList maxMask"></div>
            <div class="maskList maxMask"></div>
            <div class="maskList minMask"></div>
        </div>
        <span class="videoContenerSlide iconfont g-ab-center-MANy g-cur-poi">&#xe8f2;</span>
    </section>
    <section class="company">
        <div class="company-intrduce">
            <img src="./img/company.webp" alt="none">
        </div>
        <div class="content g-bgc-y g-f-xy-around-center">
            <div class="companyBgc g-img-10">
                <img src="./img/company.png" alt="none" title="Company profile">
            </div>
            <div class="companyText g-text-12em">
                <p class="slid-hidden">中华香舍贸易有限公司成立于2022年，是一家从事香薰的生产型出口企业。 公司主要经营产品是香薰蜡烛，远销美国、欧盟、中东、香港等全球90多个国家和地区。</p>
                <h3>Company profile</h3>
                <p>Established in 2022, Zhonghua Xiangshe Trading Co., Ltd. is a production-oriented export enterprise
                    engaged in aromatherapy. The main products of the company are scented candles, which are exported to
                    more than 90 countries and regions such as the United States, the European Union, the Middle East
                    and Hong Kong.</p>
            </div>
        </div>
    </section>
    <section id="swiper">
        <div class="main clearfix" @mouseover="btnOpen" @mouseout="btnHide">
            <div class="minMain">
                <div class="item" v-for="(item,index) in list" :key="index">
                    <img :src="item.imgUrl" />
                </div>
            </div>
            <div class="btnMain" v-show="btnShow">
                <div class="left g-cur-poi" @click="leftClick">
                    <img src="./img/left.png" />
                </div>
                <div class="right g-cur-poi" @click="rightClick">
                    <img src="./img/right.png" />
                </div>
            </div>
            <div class="pressMain">
                <span v-for="(item,index) in pressList" :class="{active:item.isShow}"></span>
            </div>
        </div>
    </section>
    <section class="shop-intrduce">
        <h3 class="title">产品介绍(Product introduction)</h3>
        <div class="intrduce g-bgc-xy g-f-xy-around-center g-f-wrap">
            <div class="shopBgc g-ab-tl g-s-100"><img
                    src="https://img0.baidu.com/it/u=3959062595,2945018615&fm=253&fmt=auto&app=138&f=JPEG?w=450&h=300"
                    alt=""></div>
            <div class="intrduceText g-text-11em">
                <h3>品牌:YUHUAN</h3>
                <h3>外壳材料：玻璃</h3>
                <h3>适用场景:生日、求婚、纪念日</h3>
                <p>产品材料使用的是食用级植物/动物蜡,孕妇也可以安心使用,外壳材料是玻璃，低温不烫手，香味稳定而悠长，均匀分布于居室,香味可扩散15m,可燃烧20小时。这款产品不仅可以安抚心绪,治愈身心还可以助眠安神,并且可以让你的生活充满仪式感。
                </p>
                <h3>Brand: YUHUAN</h3>
                <h3>Case material:glass</h3>
                <h3>Scenarios:Birthdays,marriage proposals, anniversaries</h3>
                <p>Product material is edible grade plant wax, pregnant women can also safely use, shell material is
                    glass, low temperature is not hot, stable and long fragrance, evenly distribute din the room,
                    fragrance can spread 15m, can burn for 20 hours. This product not only soothes the mind, heals the
                    body and mind, but also helps you sleep, and makes your life feel ritual.</p>
            </div>
            <div class="shop-show ">
                <div class="g-ab-tl w40"><img src="./img/produces/p1.png" alt=""></div>
                <div class="g-ab-tr w40"><img src="./img/produces/p5.png" alt=""></div>
                <div class="g-ab-bl w40"><img src="./img/produces/p8.png" alt=""></div>
                <div class="g-ab-br w40"><img src="./img/produces/p15.png" alt=""></div>
                <div class="g-ab-center w50"><img src="./img/produces/p6.png" alt=""></div>
            </div>
            <div class="shop-showMore g-f-xy-around-center g-text-12em">
                <div class="moreL">
                    <pre>
天然植物香薰蜡烛

[产地]:中国上海           [香料]:植物提取精油
[材质]:植物蜡/大豆蜡      [尺寸]:直径55mm,高68mm
[净含量] : 80g           [燃烧时长] : 20h
[香型]:蓝风铃、栀子花、海盐草、椰奶、祖马龙、玫瑰花、
白茶姜花、茉莉花、莫氏兰、小苍兰、蓝风铃、薰衣草、檀香</pre>
                </div>
                <div class="moreR">
                    <pre>
Natural plant scented candles

[Origin]: Shanghai, China           [Fragrance]: Plant derived essential oil
[Material]: Plant wax/soybean wax   [size]: diameter 55mm, height 68mm
[Net content] : 80g                 [combustion duration] : 20h
[Fragrance]: Blue wind bells, Gardenia, sea salt grass, coconut milk, Zumaron,
rose, white tea ginger, Jasmine, Morella, freesia, blue wind bells, lavender, sandalwood</pre>
                </div>
            </div>
        </div>
    </section>
    <section class="shops">
        <h3 class="title">商品区(Merchandise area)</h3>
        <div class="shopLis g-f-xy-around-center g-f-columu">
        </div>
    </section>
    <section class="userVideo">
        <h3 class="title">使用步骤(Using the step)</h3>
        <div class="userStep g-f-xy-around-center">
            <div class="userImg"><img src="./img/userStep.jpg" alt="无法显示" title="Using the step"></div>
            <div class="userVideo1">
                <video src="./img/userDes_Trim.mp4" controls></video>
            </div>
        </div>
    </section>
    <footer class="bannerComon">
        <div class="footerTop">
            <div class="footerTopBox">
                <span class="iconfont">&#xe61a;</span>
                <p class="footerContent">预约咨询服务</p>
            </div>
            <div class="footerTopBox">
                <span class="iconfont">&#xe67d;</span>
                <p class="footerContent">7天无理由退货</p>
            </div>
            <div class="footerTopBox">
                <span class="iconfont">&#xe63a;</span>
                <p class="footerContent">15天免费换货</p>
            </div>
            <div class="footerTopBox">
                <span class="iconfont">&#xe614;</span>
                <p class="footerContent">满69元包邮</p>
            </div>
            <div class="footerTopBox" style="border-right: none;">
                <span class="iconfont">&#xe818;</span>
                <p class="footerContent">1100余家售后网点</p>
            </div>
        </div>
        <div class="footerEnd">
            <div class="footerEndUl">
                <h6 class="footEndUlTitle">选购指南</h6>
                <a href="" class="footerEndUls">乌木橙花</a>
                <a href="" class="footerEndUls">冥府之路</a>
                <a href="" class="footerEndUls">白桃莫世兰</a>
                <a href="" class="footerEndUls">茉莉百花</a>
                <a href="" class="footerEndUls">青柠与罗蕾</a>
                <a href="" class="footerEndUls">玫瑰花园</a>
                <a href="" class="footerEndUls">白茶与姜花</a>
                <a href="" class="footerEndUls">祖马龙玫瑰</a>
                <a href="" class="footerEndUls">椰奶醇香</a>
                <a href="" class="footerEndUls">海盐鼠尾草</a>
            </div>
            <div class="footerEndUl">
                <h6 class="footEndUlTitle">服务中心</h6>
                <a href="" class="footerEndUls">申请售后</a>
                <a href="" class="footerEndUls">售后政策</a>
                <a href="" class="footerEndUls">维修服务价格</a>
                <a href="" class="footerEndUls">订单查询</a>
                <a href="" class="footerEndUls">以旧换新</a>
                <a href="" class="footerEndUls">保障服务</a>
                <a href="" class="footerEndUls">防伪查询</a>
                <a href="" class="footerEndUls">F码通道</a>
            </div>
            <div class="footerEndUl">
                <h6 class="footEndUlTitle">线下门店</h6>
                <a href="" class="footerEndUls">中华香舍</a>
                <a href="" class="footerEndUls">服务网点</a>
                <a href="" class="footerEndUls">授权体验店/专区</a>
            </div>
            <div class="footerEndUl">
                <h6 class="footEndUlTitle">关于我们</h6>
                <a href="" class="footerEndUls">了解香舍</a>
                <a href="" class="footerEndUls">加入香舍</a>
                <a href="" class="footerEndUls">投资者关系</a>
                <a href="" class="footerEndUls">环境，社会及管治</a>
                <a href="" class="footerEndUls">廉洁举报</a>
            </div>
            <div class="footerEndUl">
                <h6 class="footEndUlTitle">关注我们</h6>
                <a href="" class="footerEndUls">新浪微博</a>
                <a href="" class="footerEndUls">官方微信</a>
                <a href="" class="footerEndUls">联系我们</a>
                <a href="" class="footerEndUls">公益基金会</a>
            </div>
            <div class="footerEndR">
                <h4>400-100-5678</h4>
                <p>8:00-18:00 (仅收市话费)</p>
                <button><span class="iconfont">&#xe8a6;</span> 人工客服</button>
            </div>
        </div>
    </footer>
    <section style="width: 100%;">
        <div class="endBanner bannerComon">
            <div class="endBannerTop">
                <div class="endImg">
                    <img src="./img/icon.ico" alt="">
                </div>
                <div class="endBannerTopR">
                    <div class="endBannerTopRT">
                        <span><a href="">香舍商城</a></span><span>|</span>
                        <span><a href="">MIUI</a></span><span>|</span>
                        <span><a href="">香家</a></span><span>|</span>
                        <span><a href="">香聊</a></span><span>|</span>
                        <span><a href="">多看</a></span><span>|</span>
                        <span><a href="">爱看</a></span><span>|</span>
                        <span><a href="">游戏</a></span><span>|</span>
                        <span><a href="">政企服务</a></span><span>|</span>
                        <span><a href="">香舍天猫店</a></span><span>|</span>
                        <span><a href="">香舍集团隐私政策</a></span><span>|</span>
                        <span><a href="">香舍公司儿童信息保护规则</a></span><span>|</span>
                        <span><a href="">香舍商城隐私政策</a></span><span>|</span>
                        <span><a href="">香舍商城用户协议</a></span><span>|</span>
                        <span><a href="">问题反馈</a></span><span>|</span>
                        <span><a href="">Select Location 北京互联网法院法律服务工作站</a></span><span>|</span>
                        <span><a href="">北京市消费者协会</a></span><span>|</span>
                        <span><a href="">中国消费者协会</a></span>
                    </div>
                    <div class="endBannerTopRB">
                        <a href="">© mi.com 京ICP证110507号 京ICP备10046444号 京公网安备11010802020134号 京网文[2020]0276-042号
                            （京）网械平台备字（2018）第00005号 互联网药品信息服务资格证 (京)-非经营性-2014-0090 营业执照 医疗器械质量公告
                            增值电信业务许可证 网络食品经营备案 京食药网食备202010048 食品经营许可证
                            违法和不良信息举报电话：171-5104-4404 知识产权侵权投诉 本网站所列数据，除特殊说明，所有数据均出自我司实验室测试</a>
                    </div>
                    <div class="endImgs">
                        <a href=""><img src="./img/end1.png" alt=""></a>
                        <a href=""><img src="./img/end2.png" alt=""></a>
                        <a href=""><img src="./img/end3.png" alt=""></a>
                        <a href=""><img src="./img/end4.png" alt=""></a>
                        <a href=""><img src="./img/end5.png" alt=""></a>
                    </div>
                </div>
            </div>
            <h3 class="endBannerBottom">让全球每个人都能享受香薰科技带来的美好生活</h3>
        </div>
    </section>
    <section class="g-cur-poi side g-fixed-r-MANy g-f-columu g-f-xy-center g-text-8em"><span class="iconfont g-f-xy-center">&#xe736;</span><span class="backBtn g-f-xy-center">返回<br>顶部</span></section>
</body>
<script src="./src/js/swiper.js"></script>
<script src="./static/jquery-3.6.0.min.js"></script>
<script src="./src/js/index.js" type="module"></script>
<script src="./src/js/animate.js" async></script>
<script>
    // console.log($(".shopliL"));
    // $.ajax({
    //     type:"get",
    //     url:"../../static/shop.json",
    //     timeout:5000,
    //     success:(res)=>{
    //         console.log(res);
    //     },
    //     error:(err)=>{
    //         console.log(err);
    //     }
    // })
</script>

</html>